<%@page import="itsm.isperp.framework.core.context.ContextHolder"%>
<%@ page pageEncoding="UTF-8"%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="isperp" uri="/WEB-INF/tlds/isperp.tld"%>

<jsp:include page="../common/top.jsp"></jsp:include>

<jsp:include page="../common/leftmenu.jsp"></jsp:include>
<jsp:include page="../common/uploader.jsp"></jsp:include>

<style>
.table-nomargin td {
	vertical-align: middle;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	text-indent: 6px;
	padding: 0;
}

.widtha {
	width: 191px;
}

.table-nomargin tr {
	height: 35px;
	border-bottom: 1px solid #d5d6d7;
}

.selectc1 {
	display: none;
}

.selectcl1 {
	display: none;
}

.buttonA {
	background-color: #4CAF50;
	border: none;
	color: white;
	padding: 10px 42px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 16px;
	margin: 4px 2px;
	cursor: pointer;
	border-radius: 5px;
}

a {
	text-decoration: none;
}

a:HOVER {
	text-decoration: underline;
}
</style>

<div class="gBox fr frCon;"
	style="float:left;margin-left:15px;width:720px;">
	<div class="box_title" style="width:720px;">
		<i class="fa fa-table"></i>事件申报
	</div>
	<div data-role="content" class="ui-content" role="main"
		style="width:720px">
		<form id="newIncidentForm" method="post"
			action="customer/help/incident/save">
			<div style="display: none">
				<input type="hidden" id="id" name="id" value="${model.id }">
				<input type="hidden" id="nextTaskId" name="nextTaskId" /> <input
					type="hidden" id="nextTransitionId" name="nextTransitionId" />
			</div>
			<table class="form-table">
				<tr>
					<td class="td2" colspan="4">
						<h3>&nbsp;&nbsp;1.填写事件单信息</h3></td>
				</tr>

				<tr>
					<td class="td1">事件类别：</td>
					<td class="td2" colspan="3"><input type="radio"
						style="border:1px #93BEE2 solid;" name="incidentType" id="type1" onclick="changeType(1)"
						value="故障" checked="checked"><label for="type1">故障
					</label>
						<input type="radio" name="incidentType" value="需求" id="type4" onclick="changeType(2)"
						style="border:1px #93BEE2 solid;"><label for="type4">需求</label>
					</td>
				</tr>

				<tr>
					<td class="td1"><label>标题：</label></td>
					<td class="td2"><input id="title" type="text" name="title"
						value="${model.title }" maxlength="200" style="width:80%"
						placeholder="请输入标题" data-valid="标题" class="required"><span
						class="required-tip"><font color="red"> * </font><font
							color="blue">必填 </font> </span>
					</td>
				</tr>
				
				 <tr>
					<td class="td1">服务地址：</td>
					<td class="td2">
					 <select id="cilist" style="width:80%;height:30px;" 
						name="ciId">
							<c:forEach items="${listdf }" var="ci">
								<option value="${ci.address}" title="${ci.address }">${ci.address }</option>
							</c:forEach>
						</select>
				</td>
				
				
				<tr id="tr_xq1">
					<td class="td1">所属系统：</td>
					<td class="td2"><input id="systemName" type="text" name="systemName"
						value=""  style="width:180px"
						placeholder="请输入所属系统" class="">
					</td>
				</tr>
				<tr id="tr_xq2">
					<td class="td1">联络担当：</td>
					<td class="td2"><input id="ddName" type="text" name="ddName"
						value=""  style="width:180px"
						placeholder="请输入责任担当" class="">
					</td>
				</tr>
				<tr id="tr_xq3">
					<td class="td1"><label for="textarea">现状问题：</label></td>
					<td class="td2"><textarea cols="40" rows="5"
							name="xzwt" id="xzwt"
							placeholder="请输入现状问题"></textarea>
					</td>
				</tr>
				<tr id="tr_xq4">
					<td class="td1"><label for="textarea">内容：</label></td>
					<td class="td2"><textarea cols="40" rows="5"
							name="xqnr" id="xqnr"
							title="事件描述请从“改善内容+期望改善效果”3方面描述，不清楚时请“添加附件”"
							placeholder="事件描述请从“改善内容+期望改善效果”3方面描述，不清楚时请“添加附件”"></textarea>
					</td>
				</tr>
				
				<tr id="tr_gz1">
					<td class="td1"><label for="textarea">事件内容：</label></td>
					<td class="td2"><textarea cols="40" rows="5"
							name="description" id="description"
							title="请输入故障描述，不清楚时请“添加附件”"
							placeholder="请输入故障描述，不清楚时请“添加附件”"></textarea>
					</td>
				</tr>
				
				<tr>
					<td class="td1"><label>附件：</label>
					</td>
					<td class="td2">
						<div id="filelist"></div>
						<div id="container">
							<a id="pickfiles" class="nui-txt-link" href="javascript:;">添加附件</a>
						</div>
						<p class="info-txt">支持格式：jpg,gif,png,jpeg,txt,doc,docx,xls,xlsx,ppt,pptx,pdf,zip,rar&nbsp;大小：10M</p>
					</td>
				</tr>

				<tr>
					<td class="td1">发生频率：</td>
					<td class="td2"><isperp:dictSelector
							typeCode="OCCURRENCE_FREQUENCY" id="occurrenceFrequency"
							name="occurrenceFrequency" hasEmptyValue="false"
							dataWidth="250px" dictCssClass="widtha"
							selectedValue="${model.occurrenceFrequency }"></isperp:dictSelector>
					</td>

				</tr>

				


				

				<tr>
					<td class="td2" colspan="4">
						<h3>&nbsp;&nbsp;2.填写联系信息</h3></td>
				</tr>


				<tr style="display:none">
					<td class="td1"><label>联系人：</label></td>
					<td class="td2"><input id="linkmanName" type="text"
						value="${model.linkmanName }" tvalue="" name="linkmanName"
						maxlength="200" style="width:180px" placeholder="请输入姓名"
						placeholder="" data-valid="联系人" class=""><span
						class=""><font color="red">*</font><font
							color="blue">必填 </font> </span></td>
				</tr>

				<tr>
					<td class="td1">手机：</td>
					<td class="td2"><input id="userMobile" type="text"
						name="userMobile" value="${model.linkmanPhone }" maxlength="200" tvalue="${user.mobile}"
						style="width:180px" placeholder="请输入手机号码" data-valid="手机"
						class="required number"><span id="span_mobile"
						class="required-tip"><font color="red">*</font><font
							color="blue">必填 </font> </span>
					</td>
				</tr>

				<tr>
					<td class="td1">电话：</td>
					<td class="td2"><input id="userTel" type="text" name="userTel"
						value="" maxlength="20" tvalue="${user.tel}" style="width:180px"
						placeholder="请输入电话" data-valid="电话" class="">
					</td>
				</tr>

				<tr>
					<td class="td1">Email：</td>
					<td class="td2"><input id="userEmail" type="text"
						name="userEmail" value="" maxlength="200" tvalue="${user.email}"
						style="width:180px" placeholder="请填写您的Email" data-valid="Email"
						class=""><span class="">
					</td>
				</tr>

				<tr>
					<td colspan="2" id="incidentItemsTr" style="padding:0;border:none">
						<table id="incidentItems" class="form-table"></table>
					</td>
				</tr>
				<tr>
					<td colspan="2" style="text-align: center;padding:10px">
						<div id="processBtn" style="text-align: center;padding:10px;">
							<c:forEach var="lst" items="${nextSteps }">
								<input type="button" value="${lst.name }" class="buttonA"
									rid="bt" data-name="${lst.name }"
									data-ntnsid="${lst.nextTransitionId }"
									data-ntid="${lst.nextTaskId }">
							</c:forEach>
						</div>
					</td>
				</tr>
			</table>
		</form>
	</div>
</div>



<script type="text/javascript">
	$(function() {
        $("[id^='tr_xq']").hide();
		$("[rid='bt']").each(function() {
			var tname = $(this).data("name");
			if (tname == "提交") {
				var nextTransitionId = $(this).data("ntnsid");
				$(this).bind("click", function() {
					var nextTaskId = $(this).data("ntid");
					$("#nextTaskId").val(nextTaskId);
					$("#nextTransitionId").val(nextTransitionId);
					// return fasle;
					return submitNewIncident();
				});
			} else {
				$(this).bind("click", function() {
					var nextTaskId = $(this).data("ntid");
					$("#nextTaskId").val(nextTaskId);
					$("#nextTransitionId").val(nextTransitionId);
					$("#newIncidentForm").submit();
				    return true;
				});
				
			}
		});

	});
	
	function changeType(v)
	{
	  if(v==1)
	  {
	    $("[id^='tr_xq']").hide();
	    $("[id^='tr_gz']").show();
	  }else if(v==2)
	  {
	    $("[id^='tr_xq']").show();
	    $("[id^='tr_gz']").hide();
	  }
	}


	function selectCierrTips() {
		alert("输入序列号对应设备不存在,请联系服务台");
		$("#speSelector").val("");
		// $("#inputAssetCode").val("0");
	}
	function selectCiSuccess() {
		$("#inputAssetCode").val("1");
	}
	function changeIcdCategory(icdCategoryId) {
		$("#icdCategoryId").val(icdCategoryId);
	}
	function clearIcdCategory() {
		$("#icdCategoryId").val("");
		$("#icdCategorySelector").val("");
	}
	function setAddressId(ids) {
		$("#AddressSelector").val("");
		$("#addressId").val(ids);
	}
	function setAddressId1(ids, names) {
		$("#addressDetailId").val(ids);
	}

	function choseLinkType(t) {
		if (t == "1") {
			var tvalue = $("#linkmanName").attr("tvalue");
			$("#linkmanName").val(tvalue);

			var tvalue = $("#userTel").attr("tvalue");
			$("#userTel").val(tvalue);
			var tvalue = $("#userMobile").attr("tvalue");
			$("#userMobile").val(tvalue);
			var tvalue = $("#userEmail").attr("tvalue");
			$("#userEmail").val(tvalue);
			$("#span_mobile").show();
			$("#userMobile").addClass("required");
		} else {
			$("#linkmanName").val("");

			$("#userMobile").val("");
			$("#userEmail").val("");
			$("#userTel").val("");

			$("#userMobile").removeClass("required");
		}
	}
	function clear1() {
		alert("输入的位置不存在，请重新输入");
		$("#AddressSelector").val("");
		$("#addressDetailId").val("");
	}

	function selectAddress(lv) {
		var pId = $("#addressLv" + lv).val();
		// alert(pId);
		if (lv == 1) {
			$("#addressLv2").empty();
			$("#addressLv3").empty();
			$("#addressLv2").hide();
			$("#addressLv3").hide();
		} else if (lv == 2) {
			$("#addressLv3").empty();
			$("#addressLv3").hide();
		}
		if (pId == "" || pId == undefined)
			return false;
		$.getJSON("incident/address/getListByParentId?parentId=" + pId, function(data) {
			var ch = data;

			if (ch != undefined) {
				var ch_leg = ch.length;
				var opStr = "<option value=''></option>";
				for ( var i = 0; i < ch_leg; i++) {
					opStr += "<option value='"+ch[i].id+"'>" + ch[i].name + "</option>";
				}
				$("#addressLv" + (lv + 1)).append(opStr);
			}

			if (lv == 1) {
				$("#addressLv2").show();
				$("#addressLv3").hide();
			} else if (lv == 2) {
				$("#addressLv3").show();
			}

		});

	}

	function choserelateCiType(v) {
		if (v == 1) {
			$("#cilist").attr("disabled", false);
			$("#cilist").show();
			$("#otherCi").hide();

			$("#ciInputTitle").html("关联资产：")

		} else {
			$("#cilist").attr("disabled", "disabled");
			$("#cilist").hide();
			$("#otherCi").show();

			$("#ciInputTitle").html("资产序列号：")
		}
	}

	var addfile = false;
	function viewincident(icdId) {
		window.href = "incidentDispaly?id=" + icdId;
	}
	function submitNewIncident() {
		var titleVal = $("#title").val();
		var descriptionVal = $("#description").val();

		var validReult = true;
		var message = "";
		var telLength = $("#userTel").val().length;
		var mobileLength = $("#userMobile").val().length;

		var ciType = $("input[name='relateCiType']:checked").val();

		var ciId = null;
		if (ciType == 1) {
			ciId = $("#cilist").val();
		} else {
			ciId = $("otherCI").val();
		}

		/* if(!ciId){
			message+="请填写：关联设备信息\n";
			validReult=false;
		} */

		$("form .required").each(function(index, item) {
			var me = $(item);
			var t = me.is("input:checkbox") || me.is("input:radio"), tValue = "";
			if (t) {
				var tName = me.attr("name");
				tValue = me.find("input[name='" + tName + "']:checked").val();
			} else {
				tValue = me.val();
			}

			if ((tValue == "" || tValue == undefined)) {

				message += "请填写：" + (me.data("valid")) + "\n";
				validReult = false;

			}
		});

		if (!validReult) {
			alert(message);
			return false;
		}

		if (mobileLength<6 || mobileLength>12) {
			alert("手机号码有误！");
			return false;
		}
		$("#newIncidentFormSubmit").hide();
		$("#newIncidentFormSubmiting").show();
		if (addfile) {
			$(".ufp").html("0%");
			uploader.start();
		} else {
			doSubmit();
		}
		return false;
	}
	
	function setDefaultArea()
	{
	  saveCookies();
	  return false;
	}

	function saveCookies() {
		var tempName = $("#linkmanName").val();
		var tempMobile = $("#userMobile").val();
		var tempArea=$("#area").val();
		var tempAreaDetail=$("#areaDetail").val();
		$.cookie('the_username', tempName, {
			expires : 30
		});
		$.cookie('the_mobile', tempMobile, {
			expires : 30
		});
		$.cookie('the_area', tempArea, {
			expires : 360
		});
		$.cookie('the_areadetail', tempAreaDetail, {
			expires : 360
		});
	}

	function doSubmit() {
		$("#newIncidentForm").submit();
	}
</script>
<jsp:include page="../common/uploader.jsp"></jsp:include>
<jsp:include page="../common/bottom.jsp"></jsp:include>
